<template>
	<view class="content">
		<u-navbar placeholder title="我的供货商" :autoBack="true"></u-navbar>
		<view class="supplier-list" v-for="(item,index) in dataList" :key="item.id">
			<view style="font-weight: 500;font-size: 28rpx;">{{item.name}}</view>
			<view class="flex-row" style="margin-top: 15rpx;">
				<view>联系人：{{item.contacts}}</view>
				<view style="margin-left: 23rpx;">联系电话：{{item.phone}}</view>
			</view>
			<view style="margin-top: 15rpx;">邮箱：{{item.email}}</view>
			<view style="margin-top: 15rpx;">经营方式：{{item.category}}</view>
			<view style="margin-top: 15rpx;">地址：{{item.address}}</view>
			<view class="item-but">
				<view class="look-detail" @click="goEdit(item)">编辑</view>
			</view>
		</view>
		<u-loadmore :status="status" />
		<view class="submit-but" @click="goDetail">
			<view class="add-but">添加供货商</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				status: 'loading',
				dataList: [],
				pageNum: 1,
				pageSize: 20,
			}
		},
		onShow() {
			console.log(1111, uni.getStorageSync('userInfo'));

			this.pageNum = 1
			this.dataList = []
			this.status = 'loading'
			this.getList()
		},
		onReachBottom() {
			if (!this.isLoadMore) {
				//此处判断，上锁，防止最后一页还触发
				this.isLoadMore = true;
				this.pageNum++;
				this.getList();
			}
		},
		methods: {
			async getList() {
				let res = await this.$apis.procurement.supplierlist({
					pageNum: this.pageNum,
					pageSize: this.pageSize,
					nickName: uni.getStorageSync('userInfo').nickName
				})
				this.status = 'loading'
				this.dataList = [...this.dataList, ...res.rows]
				if (this.dataList.length >= res.total || res.total == 0) {
					this.isLoadMore = true
					this.status = 'nomore'
				} else {
					this.status = 'loadmore' //继续加载
					this.isLoadMore = false //打开下拉开关
				}
			},
			goDetail() {
				this.$yrouter.push({
					path: '/procurement/edit/edit'
				})
			},
			goEdit(item) {
				uni.navigateTo({
					url: `/procurement/edit/edit?id=${item.id}`
				})
			}
		}
	}
</script>

<style scoped>
	.content {
		padding-bottom: calc(130rpx + env(safe-area-inset-bottom) / 2) !important;
	}

	.supplier-list {
		width: 688rpx;
		padding: 23rpx;
		box-sizing: border-box;
		background: #FFFFFF;
		border-radius: 19rpx;
		margin: 0 auto;
		margin-top: 31rpx;
		color: #666666;
		font-size: 25rpx;
	}

	.flex-row {
		display: flex;
		align-items: center;
	}

	.item-but {
		display: flex;
		margin-top: 15rpx;
		justify-content: flex-end;
	}

	.look-detail {
		width: 162rpx;
		height: 58rpx;
		background: #2FCC71;
		border-radius: 29rpx;
		font-size: 23rpx;
		font-weight: bold;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>